﻿<mockups:WindowsPhoneChrome xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
                            xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
                            xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
                            xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
                            xmlns:mockups="clr-namespace:Microsoft.Expression.Prototyping.WindowsPhone.Mockups;assembly=WindowsPhone.Mockups"
                            xmlns:i="http://schemas.microsoft.com/expression/2010/interactivity"
                            xmlns:pi="http://schemas.microsoft.com/prototyping/2010/interactivity"
                            xmlns:ei="http://schemas.microsoft.com/expression/2010/interactions"
                            xmlns:toolkit="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone.Controls.Toolkit"
                            mc:Ignorable="d"
                            x:Class="MS_SocialPhotoSketchScreens.Screen_1"
                            x:Name="PhoneChrome">
    <mockups:WindowsPhoneChrome.Resources>
        <ResourceDictionary>
            <ResourceDictionary.MergedDictionaries>
                <ResourceDictionary Source="ProjectDataSources.xaml" />
            </ResourceDictionary.MergedDictionaries>
            <DataTemplate x:Key="PublicPhotoColItemTemplate">
                <StackPanel>
                    <Image Source="{Binding Photo}"
                           HorizontalAlignment="Stretch"
                           Height="130"
                           Width="220" />
                </StackPanel>
            </DataTemplate>
        </ResourceDictionary>
    </mockups:WindowsPhoneChrome.Resources>
    <i:Interaction.Triggers>
        <i:EventTrigger EventName="OrientationChanged">
            <i:Interaction.Behaviors>
                <ei:ConditionBehavior>
                    <ei:ConditionalExpression>
                        <ei:ComparisonCondition LeftOperand="{Binding PageOrientation, ElementName=PhoneChrome}"
                                                RightOperand="Landscape" />
                    </ei:ConditionalExpression>
                </ei:ConditionBehavior>
            </i:Interaction.Behaviors>
            <mockups:GoToStateAction StateName="Landscape"
                                     TargetObject="{Binding ElementName=LayoutRoot}"
                                     TargetName="LayoutRoot" />
        </i:EventTrigger>
        <i:EventTrigger EventName="OrientationChanged">
            <i:Interaction.Behaviors>
                <ei:ConditionBehavior>
                    <ei:ConditionalExpression>
                        <ei:ComparisonCondition LeftOperand="{Binding PageOrientation, ElementName=PhoneChrome}"
                                                RightOperand="Portrait" />
                    </ei:ConditionalExpression>
                </ei:ConditionBehavior>
            </i:Interaction.Behaviors>
            <mockups:GoToStateAction StateName="Portrait"
                                     TargetObject="{Binding ElementName=LayoutRoot}"
                                     TargetName="LayoutRoot" />
        </i:EventTrigger>
    </i:Interaction.Triggers>

    <mockups:WindowsPhoneChrome.BackButton>
        <Button Style="{StaticResource Chrome-Button}">
            <i:Interaction.Triggers>
                <i:EventTrigger EventName="Click">
                    <pi:NavigateBackAction />
                </i:EventTrigger>
            </i:Interaction.Triggers>
            <Image Source="/AppBarIcons/back.png" />
        </Button>
    </mockups:WindowsPhoneChrome.BackButton>

    <mockups:WindowsPhoneChrome.HomeButton>
        <Button Style="{StaticResource Chrome-Button}">
            <i:Interaction.Triggers>
                <i:EventTrigger EventName="Click">
                    <pi:NavigateToScreenAction TargetScreen="MS_SocialPhotoSketchScreens.Home" />
                </i:EventTrigger>
            </i:Interaction.Triggers>
            <Image Source="/AppBarIcons/home.png" />
        </Button>
    </mockups:WindowsPhoneChrome.HomeButton>

    <mockups:WindowsPhoneChrome.SearchButton>
        <Button Style="{StaticResource Chrome-Button}">
            <i:Interaction.Triggers>
                <i:EventTrigger EventName="Click">
                    <pi:NavigateToScreenAction TargetScreen="MS_SocialPhotoSketchScreens.Search" />
                </i:EventTrigger>
            </i:Interaction.Triggers>
            <Image Source="/AppBarIcons/search.png" />
        </Button>
    </mockups:WindowsPhoneChrome.SearchButton>

    <Grid x:Name="LayoutRoot"
          DataContext="{Binding Source={StaticResource SampleDataSource}}">
        <Grid.RowDefinitions>
            <RowDefinition Height="auto" />
            <RowDefinition Height="*" />
            <RowDefinition Height="auto" />
        </Grid.RowDefinitions>
        <VisualStateManager.CustomVisualStateManager>
            <ei:ExtendedVisualStateManager />
        </VisualStateManager.CustomVisualStateManager>
        <VisualStateManager.VisualStateGroups>
            <VisualStateGroup x:Name="CommonStates"
                              ei:ExtendedVisualStateManager.UseFluidLayout="True">
                <VisualState x:Name="Portrait" />
                <VisualState x:Name="Landscape">
                    <Storyboard>
                        <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(WindowsPhoneChrome.PageOrientation)"
                                                       Storyboard.TargetName="PhoneChrome">
                            <DiscreteObjectKeyFrame KeyTime="0">
                                <DiscreteObjectKeyFrame.Value>
                                    <mockups:PageOrientation>Landscape</mockups:PageOrientation>
                                </DiscreteObjectKeyFrame.Value>
                            </DiscreteObjectKeyFrame>
                        </ObjectAnimationUsingKeyFrames>
                    </Storyboard>
                </VisualState>
            </VisualStateGroup>
        </VisualStateManager.VisualStateGroups>
        <TextBlock Style="{StaticResource TextBlock-Sketch}"
                   TextWrapping="Wrap"
                   Text="Social Photo"
                   FontSize="32"
                   VerticalAlignment="Center"
                   Margin="4,0,0,0" />
        <ListBox Grid.Row="1"
                 Style="{StaticResource ListBox-Sketch}"
                 ItemTemplate="{StaticResource PublicPhotoColItemTemplate}"
                 ItemsSource="{Binding PublicPhotoCol}"
                 Margin="8,0,8,8"
                 VerticalAlignment="Center"
                 HorizontalAlignment="Center"
                 Width="466">
            <i:Interaction.Triggers>
                <i:EventTrigger EventName="SelectionChanged">
                    <pi:NavigateToScreenAction TargetScreen="MS_SocialPhotoSketchScreens.DetailPage" />
                </i:EventTrigger>
            </i:Interaction.Triggers>
            <ListBox.ItemsPanel>
                <ItemsPanelTemplate>
                    <toolkit:WrapPanel Width="450" />
                </ItemsPanelTemplate>
            </ListBox.ItemsPanel>
        </ListBox>
        <Grid x:Name="Login" Grid.Row="2">
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="0.277*" />
                <ColumnDefinition Width="0.723*" />
            </Grid.ColumnDefinitions>
            <Grid.RowDefinitions>
                <RowDefinition Height="0.205*" />
                <RowDefinition Height="0.071*" />
                <RowDefinition Height="0.07*" />
                <RowDefinition Height="0.654*" />
            </Grid.RowDefinitions>
            <TextBlock Grid.Row="1"
                       Style="{StaticResource TextBlock-Sketch}"
                       TextWrapping="Wrap"
                       Text="User name"
                       VerticalAlignment="Center"
                       HorizontalAlignment="Center"
                       FontSize="29.333" />
            <TextBlock Grid.Row="2"
                       Style="{StaticResource TextBlock-Sketch}"
                       TextWrapping="Wrap"
                       Text="Password"
                       HorizontalAlignment="Center"
                       VerticalAlignment="Center"
                       FontSize="29.333" />
            <TextBox Grid.Column="1"
                     Margin="8"
                     Grid.Row="1"
                     Style="{StaticResource TextBox-Sketch}"
                     TextWrapping="Wrap" Text="admin" />
            <PasswordBox Grid.Column="1"
                         Margin="8"
                         Grid.Row="2"
                         Style="{StaticResource PasswordBox-Sketch}" Password="12345678" />
            <Button Content="Login"
                    HorizontalAlignment="Left"
                    Height="55"
                    Margin="129,26,0,0"
                    Grid.Row="3"
                    Style="{StaticResource Button-Sketch}"
                    VerticalAlignment="Top"
                    Width="121"
                    Grid.ColumnSpan="2">
                <i:Interaction.Triggers>
                    <i:EventTrigger EventName="Click">
                        <pi:NavigateToScreenAction TargetScreen="MS_SocialPhotoSketchScreens.MainPage" />
                    </i:EventTrigger>
                </i:Interaction.Triggers>

            </Button>
            <Button Content="Reset"
                    Grid.Column="1"
                    Height="55"
                    Margin="102,26,124,0"
                    Grid.Row="3"
                    Style="{StaticResource Button-Sketch}"
                    VerticalAlignment="Top"
                    RenderTransformOrigin="1.438,0.545">
                <i:Interaction.Triggers>
                    <i:EventTrigger EventName="Click">
                        <pi:NavigateToScreenAction TargetScreen="MS_SocialPhotoSketchScreens.Screen_1" />
                    </i:EventTrigger>
                </i:Interaction.Triggers>

            </Button>
            <CheckBox Content="Remember me"
                      Grid.Column="1"
                      Height="18"
                      Margin="8,8,8,0"
                      Grid.Row="3"
                      Style="{StaticResource CheckBox-Sketch}"
                      VerticalAlignment="Top" IsChecked="True" />
        </Grid>
        <!--<Button Content="Login"
                Grid.Row="2"
                Style="{StaticResource Button-Sketch}">
            <i:Interaction.Triggers>
                <i:EventTrigger EventName="Click">
                    <pi:NavigateToScreenAction TargetScreen="MS_SocialPhotoSketchScreens.LoginPage" />
                </i:EventTrigger>
            </i:Interaction.Triggers>
        </Button>-->
    </Grid>
</mockups:WindowsPhoneChrome>